<template>
  <div style="height: 100%;">
    <el-button  type="primary" @click="newClosing">创建结项检查</el-button>
    <div class="table_resource" style="text-align: center;height: 95%;">
      <el-table
      v-loading="tableLoading"
      element-loading-text="拼命加载中"
      element-loading-spinner="el-icon-loading"
      :data="showTable" border
       style="width: 100%"
      :header-cell-style="{background:'#eef1f6',color:'#606266','text-align':'center'}"
      :cell-style="{'text-align':'center'}"
      height="100%"
       stripe
      >
        <el-table-column
          prop="phaseName"
          label="结项检查名称"
          width="300"
        >
        </el-table-column>
        <el-table-column
          prop="phaseTeacherStart"
          label="申报开始时间"
        >
        </el-table-column>
		<el-table-column
		  prop="phaseSchoolFirstEnd"
		  label="审核结束时间"
		>
		</el-table-column>
        <el-table-column
        width="400" >
          <template slot="header">
            <input v-model="keywords" placeholder="请输入结项检查名称" class="el-input__inner" />
          </template>
		  <template slot-scope="scope">
        <div style="float: left;">
          <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">修改</el-button>
          <el-button
            size="mini"
            type="danger"
            @click="deletePhase(scope.$index, scope.row)">删除</el-button
          >
          <el-button size="mini" type="primary" v-if="scope.row.phaseExpertStart!=null && scope.row.phaseExpertStart!=''" @click="expertSet(scope.row)">专家设置</el-button>
        </div>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="resource-page">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :page-sizes="[5,10,15]"
        :page-size="pagesize"
        :pager-count="7"
        layout=" prev, pager, next,sizes, jumper"
        :total="filterDataShow.length"
      >
      </el-pagination>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      tableLoading:true,
      keywords: "", // 搜索的关键字
      filterDataShow: [], //储存符合条件的数据-
      tableData: [], //分页前的数据
      pagesize: 10,
      currentPage: 1,
      BatchIsHasData:"",
    };
  },
  mounted() {
    this.getDataAxios();
  },
  methods: {
    expertSet(row){
      this.$router.push({path:'/closingExpert',query:{phaseId:row.phaseId}})
    },
    getNowDate(){
      var nowDate = new Date();
      var year = nowDate.getFullYear();
      var month = nowDate.getMonth() + 1 < 10 ? "0" + (nowDate.getMonth() + 1): nowDate.getMonth() + 1;
      var day = nowDate.getDate() < 10 ? "0" + nowDate.getDate() : nowDate.getDate();
      var dateStr = year + "-" + month + "-" + day;
      console.log(dateStr)
      return dateStr
    },
    newClosing(){
        this.$router.push( '/closingCreate')
    },
    //获取批次数据
    getDataAxios() {
      let _that = this;
	  this.$api.phase.getAllPhase()
	  .then(
	  (response)=>{
      console.log(response)
	  	this.tableData=response.data.data.filter(item => item.type==3)
      this.tableLoading=false
      const totalPage = Math.ceil((this.tableData.length) / this.pagesize)
      this.currentPage = this.currentPage > totalPage ? totalPage : this.currentPage
      this.currentPage = this.currentPage < 1 ? 1 : this.currentPage
      this.filterDataShow = this.tableData
      // this.searchResource(); //在页面挂载后调用此方法，确保数据与页面发生了交互
	  }
	  )}
	,
	deletePhase(index, row){
		console.log(row.batchId)
		this.$confirm('此操作将永久删除该结项检查, 是否继续?', '提示', {
					  confirmButtonText: '确定',
					  cancelButtonText: '取消',
					  type: 'warning',
					  center: true,
					}).then(() => {
					 this.$api.phase.deletePhaseById({
						 phaseId:row.phaseId
					 }).then((res)=>{
             console.log(res)
             this.getDataAxios()
           })
					  this.$message({
						type: 'success',
            center:true,
            offset:screen.height  / 2 -200,
            duration:2000,
						message: '删除成功!'
					  });
					}).catch(() => {
					  this.$message({
						type: 'info',
            center:true,
            offset:screen.height  / 2 -200,
            duration:2000,
						message: '已取消删除'
					  });
					});
			  }
		,
    //查询
    searchResource() {
      this.currentPage = 1; //将当前页设置为1，确保每次都是从第一页开始搜
      let filterKeywords = this.keywords.trim();
      let filerReasource = this.tableData.filter((item) => {
        //过滤全部数据
        if (item.phaseName.includes(filterKeywords)) {
          return item;
        }
      });
      this.filterDataShow = filerReasource; //将符合条件的内容赋给filterDataShow
    },
    onSubmit() {},
    handleSizeChange(psize) {
      this.pagesize = psize;
    },
    handleCurrentChange(currentPage) {
      this.currentPage = currentPage;
    },
    handleEdit(index, row) {
      this.$router.push({path: '/closingEdit', query: {phaseId: row.phaseId}})
    },
    handleDelete(index, row) {
      console.log(row);
    },

    batchDepMaxPassNumber(index, row) {
      this.$router.push({path: '/batchDepMaxPassNumber', query: {batch_id: row.batchId}})
      console.log(row);
    },
  },
  watch: {
    //监听搜索框内容，当搜索框内容发生变化时调用searchResource方法
    keywords() {
      this.searchResource();
    },
  },
  computed: {
    //showTable计算属性通过slice方法计算表格当前应显示的数据
    showTable() {
      return this.filterDataShow.slice(
        (this.currentPage - 1) * this.pagesize,
        this.currentPage * this.pagesize
      );
    },
  },
};
</script>
<style scoped>
#find {
  width: 400px;
  margin-bottom: 30px;
}
</style>
